<%--
  Created by IntelliJ IDEA.
  User: 肖
  User:功能实现-许华钢
  Date: 2020/9/24
  Time: 22:20
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>精翼</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/bootstrap-3.3.7-dist/css/bootstrap.css">
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/footer.css"/>
    <script src="${pageContext.request.contextPath}/plugins/jquery/jquery.min.js"></script>
    <script src="${pageContext.request.contextPath}/plugins/bootstrap-3.3.7-dist/js/bootstrap.js"></script>
</head>
<body>
<nav class="navbar navbar-default" role="navigation">
    <div class="container-fluid">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse"
                    data-target="#example-navbar-collapse">
                <span class="sr-only">切换导航</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand" href="../index/index.jsp">精翼</a>
        </div>
        <div class="collapse navbar-collapse" id="example-navbar-collapse">

            <ul class="nav navbar-nav  navbar-right">
                <li ><a href="../sellCar/sellCar.jsp">我要卖车</a></li>
                <li><a href="../buyCar/buyCar.jsp">我要买车</a></li>
                <li class="active"><a href="${pageContext.request.contextPath}/NavJsp/toIndex">首页</a></li>
                <li class="active" id="topname"></li>
                <li class="active"></li>
            </ul>
        </div>
    </div>
</nav>

<!-- 登录bigin -->
<div class="container">

    <div class="middle-box text-center loginscreen   animated fadeInDown">
        <div>
            <div>
                <h1 class="logo-name">J Y</h1>
            </div>
            <h3>欢迎登录 精翼 </h3>
            <form class="m-t" role="form">

                <div class="form-group"  style="width: 400px; margin-left: 370px;">
                    <input value='${username}' id="username"  name='username' type="text" class="form-control" placeholder="账号（用户为其手机号）" required="">
                </div>
                <c:if test="${error==1}">
                    <input type="text" value="账号有误，请重新输入" id="remind1" style="font-weight: bold;color: red;border: 0px solid">
                </c:if>
                <div class="form-group" style="width: 400px; margin-left: 370px;">
                    <%--                    <input value='${password}' id="password"  name='password' type="password" class="form-control" placeholder="密码" required="">--%>
                    <input class="form-control" style="height: 34px ;width:300px;float:left;border: 1px solid #ccc" value="" name="codes" id="codes" type="text"  placeholder="请输入验证码" required="">

                    <button  style="height: 34px ;width:90px;border: 1px solid #ccc;float: right" type="button" id="getCode" onclick="getCode1()">获取验证码</button>

                </div>
                <br>
                <br>

                <div class="form-group text-left" style="width: 400px; margin-left: 370px;">
                    <div class="checkbox i-checks">
                        <label class="no-padding"></label>
                        <a style="float: right" href="${pageContext.request.contextPath}/NavJsp/toLogin">账号密码登录</a>
                    </div>
                </div>
                <button id="log" type="button" class="btn btn-primary block full-width m-b">登 录</button>

                <p class="text-muted text-center"><small>还没有账户？</small><a href="${pageContext.request.contextPath}/NavJsp/toRegister">点此注册</a>
                </p>

            </form>
        </div>
    </div>

</div>
<!-- 登录end -->


<!-- footer start -->
<!-- footer end -->
<script src="${pageContext.request.contextPath}/plugins/jquery/jquery.min.js"></script>
<script src="${pageContext.request.contextPath}/plugins/bootstrap-3.3.7-dist/js//bootstrap.js"></script>
<%--<script src="${pageContext.request.contextPath}/ajax/logRegist.js"></script>--%>
<script type="text/javascript"></script>
<script>

    var obj = document.getElementById("getCode");
    var fl = 60;//全局变量
    // obj.onclick = function () {
    function getCode1() {
        var phone = document.getElementById("username").value;
        if(!(/^1[3456789]\d{9}$/.test(phone))){
            alert("请输入正确的手机号");
            return;
        }else if (fl<60){
            //防止多次点击bug，控制正常倒计时
            alert("验证码已发送");
            return;
        }else {
            //根据号码ajax请求实现发送验证码
            $.ajax({
                type:'GET',
                dataType:"json",
                url:'${pageContext.request.contextPath}/send/'+phone,
                success:function (data) {
                    if (data.code == "200"){
                        timer();
                        alert("发送成功")
                    } else {
                        alert("发送失败")
                    }
                }
            });
        }
    }

    // };
    //计时器
    function timer(){
        fl--;
        obj.innerHTML = fl+"s";
        if (fl==0){
            obj.innerHTML="获取验证码";
            fl = 60;
        }else {
            setTimeout("timer()",1000);//递归调用
        }
    }

    $(function () {
        $("#log").click(function () {
            let username = $("#username").val();
            let code = $("#codes").val();
            window.location = "${pageContext.request.contextPath}/logAndRegist/logSms/" + username + "/" + code;
        })
    });
</script>
</body>
</html>